<template>
	<div >
    <div style="position: relative; height:200px; overflow: hidden;">
      <div style="background: #2180C1; height: 50px; position: absolute; top: 0px; left: 0px; width: 100%; z-index: 1;"></div>
      <div style="position: absolute; left: 0; top: 0; width: 100%; z-index: 2;">
        <div class="flexb ww">
          <div>
            <img src="../../static/img/logo.png" style="width: 200px; height: 200px; background: #fff; cursor: pointer;" @click="$router.push('/')">
          </div>
          <div>
            <div class="flex" style="justify-content: flex-end; padding: 10px 0;">
              <div style="margin-right: 15px;"><img src="../../static/img/icon-ZA1.svg" style="width: 30px; height: 30px;"></div>
              <div style="margin-right: 15px;"><img src="../../static/img/icon-KIDA1.svg" style="width: 30px; height: 30px;"></div>
              <div style="margin-right: 15px;"><img src="../../static/img/icon-ZA2.svg" style="width: 30px; height: 30px;"></div>
              <div style="margin-right: 15px;"><img src="../../static/img/icon-KIDA2.svg" style="width: 30px; height: 30px;"></div>
              <div style="margin-right: 15px;"><img src="../../static/img/icon-ZDO_B1.svg" style="width: 30px; height: 30px;"></div>
              <div style="margin-right: 15px;"><img src="../../static/img/icon-ZB1.svg" style="width: 30px; height: 30px;"></div>
              <div style="margin-right: 15px;"><img src="../../static/img/icon-ZB2.svg" style="width: 30px; height: 30px;"></div>
              <div style="margin-right: 15px;"><img src="../../static/img/icon-ZC1.svg" style="width: 30px; height: 30px;"></div>
              <div style="margin-right: 15px;"><img src="../../static/img/icon-ZC2.svg" style="width: 30px; height: 30px;"></div>
            </div>

            <div class="flexc" style="justify-content: flex-end; line-height: 30px; padding-top: 100px;">
              <div class="flexc" @click="gerenzhongxin()" v-if="denglu" style="color: #2180C1; cursor: pointer;">
                <i class="el-icon-user-solid" style="margin-right: 10px; color: #999;"></i>
                我的奥德（个人中心）
              </div>
              <div class="flexc" style="margin-left: 20px; color: #2180C1;" @click="tuichu()"  v-if="denglu">
                退出
              </div>


              <div class="flexc" v-if="!denglu">
                <i class="el-icon-user-solid" style="margin-right: 10px; color: #999;"></i>
                未登录
              </div>
              <div class="flexc" style="margin-left: 20px; cursor: pointer; color: #2180C1;" @click="denglugo()"  v-if="!denglu">
                登录
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
	  <div class="ww" style="margin-bottom: 20px;">
	    <div class="flexcc">
        <router-link to="/index" class="nav">首页</router-link>
        <router-link to="/kaoshi" class="nav">奥德考试报名</router-link>
        <router-link to="/kaochang" class="nav">奥德考试中心</router-link>
        <router-link to="/kaoguan" class="nav">奥德者试简介</router-link>
        <router-link to="/guanyuwomen" class="nav">关于我们</router-link>
        <!-- <router-link to="/xinwen" class="nav">新闻</router-link> -->
	    </div>
	  </div>
	</div>
</template>

<script>
	export default {
		name: 'top',
		data() {
			return {
        osd_person:JSON.parse(localStorage.getItem('osd_person')) || '',
        denglu:false
			}
		},
		created() {
      //判断用户是否登录的接口
      axios.post(this.IP_URL+'/user/getinfo').then((response)=>{
        if(response.data.errorcode == 0){
          this.denglu = true
        } else {

        }
      })


		},
		mounted() {

		},
		methods: {
      tuichu:function(){
        axios.post(this.IP_URL+'/user/logout').then((response)=>{
          if(response.data.errorcode == 0){
            this.$message.success('已退出登录');
            this.$router.push('/')
          } else {
            this.$message.error(response.data.reason);
          }
        })
      },
      denglugo:function(){
        this.$router.push('/denglu')
      },
      gerenzhongxin:function(){

        this.$router.push('/gerenzhongxin')
      }
		}
	}
</script>


<style scoped lang="less">
  .nav{ margin-left: 100px; color: #0872BA; font-size: 20px; font-weight: bold; cursor: pointer;}
  .aa{border-bottom: 3px solid #0872BA;}
</style>
